<template>
  <div class="bgc-default pad-20">
    <div class="bg-color-white pad-20">
      <div class="tabs-box mar-t--10">
        <el-tabs v-model="tabActiveStatus" @tab-click="doChangeTab">
          <el-tab-pane :label="labels[-1]" name="-1"> </el-tab-pane>
          <el-tab-pane :label="labels[1]" name="1"> </el-tab-pane>
          <el-tab-pane :label="labels[20]" name="20"> </el-tab-pane>
          <el-tab-pane :label="labels[2]" name="2"> </el-tab-pane>
          <el-tab-pane :label="labels[3]" name="3"> </el-tab-pane>
          <el-tab-pane :label="labels[4]" name="4"> </el-tab-pane>
          <el-tab-pane :label="labels[5]" name="5"> </el-tab-pane>
          <el-tab-pane :label="labels[100]" name="100"> </el-tab-pane>
        </el-tabs>
      </div>
      <!-- 第三方订单 -->
      <third-order-list v-on:updateOrderStat="updateOrderStat" v-if="tabActiveStatus == -1"></third-order-list>
      <!-- 系统订单 -->
      <project-order-list v-on:updateOrderStat="updateOrderStat" v-else :orderStatus="tabActiveStatus"></project-order-list>
    
    </div>
  </div>
</template>

<script>
  import { statThirdOrder } from '@/api/goods/thirdOrder'
  import ThirdOrderList from './components/third-order-list'
  import ProjectOrderList from './components/project-order-list'

  export default {
    components: {
      ThirdOrderList, ProjectOrderList
    },
    data() {
      return {
        // tab model
        tabActiveStatus: '-1',
        labels: {
          '-1': '已同步(0)',
          '-10': '待付货款(0)',
          '1': '待发货(0)',
          '20': '部分发货(0)',
          '2': '已发货(0)',
          '3': '已收货(0)',
          '4': '已完成(0)',
          '5': '已取消(0)',
          '100': '全部已生成(0)'
        }
      }
    },
    // 初始化页面
    created() {
      this.init()
    },
    methods: {
      init() {
        const form = {
          enterpriseId: this.getEnterpriseId(),
          memberId: this.getMemberId(),
          shopType: 1
        }
        statThirdOrder(form).then(response => {
          if (response.isError) return
          this.labels[-1] = '已同步(' + (response.data[-1] || 0) + ')'
          this.labels[-10] = '待付货款(' + (response.data[-10] || 0) + ')'
          this.labels[1] = '待发货(' + response.data[1] + ')'
          this.labels[20] = '部分发货(' + response.data[20] + ')'
          this.labels[2] = '已发货(' + (response.data[2] || 0) + ')'
          this.labels[3] = '已收货(' + (response.data[3] || 0) + ')'
          this.labels[4] = '已完成(' + (response.data[4] || 0) + ')'
          this.labels[5] = '已取消(' + (response.data[5] || 0) + ')'
          this.labels[100] = '全部已生成(' + response.data[100] + ')'
        })
      },
      // tab切换事件
      doChangeTab() {
        this.init()
      },
      // 重新统计事件
      updateOrderStat() {
        this.init()
      }
    }
  }
</script>

<style lang="less" scoped>

</style>